<template>
  <view class="new-list">
    <view
      class="new-item uni-item-line"
      style="align-items: center"
      @tap="goDetail(ballInfo)"
      v-if="ballInfo.title"
    >
      <image
        class="img"
        src="../../static/img/bell-g.png"
        mode="aspectFill"
        style="width: 60upx; height: 60upx; margin: 0 85upx"
      ></image>
      <view class="con">
        <view class="tit">{{ ballInfo.title }}</view>
        <view class="time">{{ ballInfo.createTime }}</view>
      </view>
      <image
        class="tips"
        src="../../static/img/balltips.png"
        mode="widthFix"
      ></image>
    </view>
    <view class="new-item uni-item-line" style="align-items: center" v-else>
      <image
        class="img"
        src="../../static/img/bell-g.png"
        mode="aspectFill"
        style="width: 60upx; height: 60upx; margin: 0 85upx"
      ></image>
      <view class="con">
        <view class="tit">暂无所属社区消息</view>
      </view>

      <image
        class="tips"
        src="../../static/img/balltips.png"
        mode="widthFix"
      ></image>
    </view>
    <view
      class="new-item uni-item-line animated fadeInDown"
      style="animation-duration: 300ms"
      v-for="(v, index) in list"
      :key="index"
      @tap="goDetail(v)"
    >
      <image
        class="img"
        :src="v.imgUrl || '../../static/img/new1.jpg'"
        mode="aspectFill"
      ></image>
      <view class="con">
        <view class="tit">{{ v.title }}</view>
        <view class="time">{{ v.publishTime }}</view>
      </view>
      <!--      <image
        class="tips"
        src="../../static/img/com_tips.png"
        mode="widthFix"
      ></image> -->
      <image
        class="tips"
        src="../../static/img/gf_message.png"
        mode="widthFix"
      ></image>
      <image
        v-if="v.identity == 'sq_message'"
        class="tips"
        src="../../static/img/sq_message.png"
        mode="widthFix"
      >
      </image>
      <image
        v-if="v.identity == 'disease_control'"
        class="tips"
        src="../../static/img/disease_control.png"
        mode="widthFix"
      ></image>
    </view>
    <p class="dtext" v-if="loadtype">
      <span class="u-font-sm">加载中</span>
      <u-loading mode="flower"></u-loading>
    </p>
    <p v-else>
      <u-divider>没有更多了</u-divider>
    </p>
    <!-- <view class="new-item" v-for="(v,index) in 1" :key="v.id" @tap="goDetail">
			<image class="img" src="../../static/img/new1.jpg" mode="aspectFill"></image>
			<view class="con">
				<view class="tit">卡介疫苗接种</view>
				<view class="time">09月06日 上午 8:30</view>
			</view>
		</view> -->
    <!-- <view class="zanwei" v-if="wHeight" :style="{height: wHeight+'upx'}"></view> -->
  </view>
</template>

<script>
export default {
  data() {
    return {
      wHeight: 0,
      ballInfo: {}, // 铃铛消息
      page: {},
      list: [],
      loadtype: true, //加载状态
    };
  },
  onReachBottom() {
    if (this.page.isLastPage) return;
    // this.getMoreListInfo(this.page.pageNum + 1);
  },
  methods: {
    getMoreList() {
      console.log(this.page);
      //console.log('触底了List')
      if (this.page.isLastPage) return;
      this.getMoreListInfo(this.page.pageNum + 1);
    },
    // 获取铃铛消息
    getBallInfo() {
      let self = this;
      // uni.showLoading({title: '加载中',mask: true});
      setTimeout((s) => {
        uni.hideLoading();
      }, 5000);
      this.config
        .post("/message/listDept", {
          pageNum: "1",
          pageSize: "1",
          isTop: "1",
          communityId: 0,
        })
        .then((res) => {
          // uni.hideLoading();
          if (res.data.code === 200 && res.data.data) {
            // console.log(res)
            self.ballInfo = res.data.data.list ? res.data.data.list[0] : {};
          } else {
            if (res.data.code == "-201") {
              self.config.handleError(res.data);
            } else {
              uni.showToast({
                title: self.config.handleError(res.data),
                icon: "none",
              });
            }
          }
        });
    },
    //获取列表消息
    getListInfo() {
      let self = this;
      // uni.showLoading({title: '加载中',mask: true});
      this.config
        .post("/message/list", {
          pageNum: "1",
          pageSize: "10",
          type: "1",
          toType: "1",
          communityId: 0,
        })
        .then((res) => {
          // uni.hideLoading();
		  console.log(res)
          if (res.data.code === 200) {
            self.page = res.data.data;
            self.list = res.data.data.list;
          } else {
            if (res.data.code == "-201") {
              self.config.handleError(res.data);
            } else {
              uni.showToast({
                title: self.config.handleError(res.data),
                icon: "none",
              });
            }
          }
        });
    },
    // 获取更多列表消息
    getMoreListInfo(pageNumber) {
      this.loadtype = true;
      // uni.showLoading({title: '加载中',mask: true});
      let self = this;
      this.config
        .post("/message/list", {
          pageNum: pageNumber ? pageNumber : "1",
          pageSize: "10",
          type: "1",
          toType: "1",
        })
        .then((res) => {
          // uni.hideLoading();
          if (res.data.code === 200) {
            this.loadtype = false;
            self.page = res.data.data;
            self.list = self.list.concat(res.data.data.list);
          } else {
            if (res.data.code == "-201") {
              self.config.handleError(res.data);
            } else {
              uni.showToast({
                title: self.config.handleError(res.data),
                icon: "none",
              });
            }
          }
        });
    },
    goDetail(v) {
      uni.navigateTo({
        url:
          "/pages/main/pregnant/message-detail?id=" +
          v.id +
          "&title=" +
          v.title +
          "&type=" +
          1,
      });
    },
  },
  mounted() {
    // this.uniDetail = JSON.parse(uni.getStorageSync('community'))
    this.getBallInfo();
    //this.getListInfo()
    this.getMoreListInfo();
    let self = this;
    this.sysInfo = uni.getSystemInfo({
      success(res) {
        self.wHeight = res.screenHeight;
      },
    });
  },
  //onShow() {
  // this.getBallInfo()
  // this.getListInfo()

  //	},
};
</script>

<style lang="less" scoped>
.dtext {
  width: 100%;
  display: flex;
  justify-content: center;
}

.new-list {
  padding: 20upx 0;

  // background-color: #FAFAFA;
  .new-item {
    display: flex;
    background-color: #fff;
    padding: 20upx;
    // box-shadow: 0 0 20upx 0 #FAFAFA;
    // box-shadow: 0 0 20upx 0 #eee;
    position: relative;

    .img {
      width: 200upx;
      height: 150upx;
      margin-right: 30upx;
    }

    .con {
      margin-top: 10upx;

      .tit {
        width: 400upx;
        font-size: 28upx;
        font-weight: 900;
        color: #555;
        overflow: hidden;
        text-overflow: ellipsis;
        // white-space: nowrap;
      }

      .time {
        font-size: 24upx;
        color: #ccc;
        margin-top: 10upx;
      }
    }

    .tips {
      position: absolute;
      right: 0;
      top: 0;
      width: 120upx;
    }
  }
}
</style>
<style scoped>
@media (prefers-color-scheme: closedark) {
  //  黑暗模式
  * {
    color: #ffffff !important;
  }

  .new-list {
    background-color: #1b1c1e !important;
  }

  .new-item {
    background-color: #1b1c1e !important;
  }
}
</style>
